<!DOCTYPE html>
<!-- where.html
     Uses where.js
     Illustrates x and y coordinates of the mouse cursor
     -->
<html lang = "utf-8">
  <head>
    <title> Where is the cursor? </title>
    <meta charset = "utf-8" />
    <script type = "text/javascript"  src = "where.js" >
    </script>
  </head>
  <body onclick = "findIt(event)">
    <form action = "">
      <p> 
        Within the client area: <br />
        x:
        <input type = "text"  id = "xcoor1"  size = "4" />
        y:
        <input type = "text"  id = "ycoor1"  size = "4" />
        <br /><br />
        Relative to the origin of the screen coordinate system:
        <br />
        x:
        <input type = "text"  id = "xcoor2"  size = "4" />
        y:
        <input type = "text"  id = "ycoor2"  size = "4" />
      </p>
    </form>
    <p>
      <img src = "../images/plane1.jpg"  alt = "(Picture of an airplane)" 
           height = "300" width = "450" />
    </p>
  </body>
</html>